<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    /* #mydiv{
      background-color: green;
    }
    .odiv{
      background-color: blue;
    }
    div{
      background-color: red;
    } */
    /* 权重值其实是选择器的权重值相加后再比较结果 */
   .odiv div{
     background-color: red;
   }
   /* !important 我最重要，都以我为主 优先级大于id，但内联样式不可用 */
   .qiantao{
     background-color: blue !important;
   }
   /* 制定(指定)大于继承 */
  
   .odiv{
     color: greenyellow;
   }
   span{
     color: hotpink;
   }

  </style>
</head>

<body>
    <div id="mydiv" class="odiv">大大大
      <div class="qiantao">嵌套</div>
      <span>大头儿子</span>
    </div>

</body>
</html>